elitecons - Construction Company HTML Template

Thank you


First of all, thank you for purchasing the elitecons HTML Template. You can find the detailed information about the template in this document. If there is anything you cannot find in this document, you can send an e-mail via the profile page.

1Installation

Follow the steps below to setup your site template:

  1. Unzip the downloaded package and open the Template folder to find all the template files. You wil get elitecons folder in there. You will need to upload you desire template to your hosting web server using FTP in order to use it on your website.
  2. Below is the folder structure and needs to be uploaded to your website root directory:
    • elitecons/assets/css - Stylesheet files
    • elitecons/assets/fonts - Icon/fonts files
    • elitecons/assets/images - Image files
    • elitecons/assets/inc - Contact from file
    • elitecons/assets/js - Custom js files
    • elitecons/assets/vendors - All js and css files
  3. You need to upload all or specific HTML files as per your need.
  4. And now you are ready to go to generate your webiste with this awesome template.

2HTML Structure

We are used Bootstrap 5 framework in this template.
The general template structure is the same throughout the template. Here is the general structure.

#Favicon Settings

Favicon Will be found in head section.

        

            <link rel="apple-touch-icon" sizes="180x180" href="assets/images/favicons/apple-touch-icon.png" />
            <link rel="icon" type="image/png" sizes="32x32" href="assets/images/favicons/favicon-32x32.png" />
            <link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicons/favicon-16x16.png" />
            <link rel="manifest" href="assets/images/favicons/site.webmanifest" />

        
        

#Logo Settings

The Logo will be found in the Theme Main Menu section.

            

                <div class="main-menu__logo">
                    <a href="index.html"><img src="assets/images/resources/logo-1.png" alt=""></a>
                </div>

            
        

You can replace any .jpg .png .svg logo.

#Fonts Settings

elitecons (elitecons- Template) we use google fonts Yantramanav
You can change both fonts form head section:

        


            <link href="https://fonts.googleapis.com/css2?family=Yantramanav:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">

        
        

#Contact Form

Activeted PHP Contact Form

You can edit your form simply and quickly. Open sendemail.php in inc folder and change following area

    
    <?php

    // Define Host Info || Who is sending emails?
    define("HOST_NAME", "Poitech Mailer");
    define("HOST_EMAIL", "poitech@mail.com");
    
    // Define SMTP Credentials || Gmail Informations
    define("SMTP_EMAIL", "mail@gmail.com");
    define("SMTP_PASSWORD", "your_gmail_pass"); // read documentations
    
    
    // Define Recipent Info ||  Who will get this email?
    define("RECIPIENT_NAME", "John Doe");
    define("RECIPIENT_EMAIL", "jhon@mail.com");
    
    
    use PHPMailer\PHPMailer\PHPMailer;
    use PHPMailer\PHPMailer\Exception;
    use PHPMailer\PHPMailer\SMTP;
    
    require './PHPMailer/src/Exception.php';
    require './PHPMailer/src/PHPMailer.php';
    require './PHPMailer/src/SMTP.php';
    
    
    
    
    
    //Create an instance; passing `true` enables exceptions
    $mail = new PHPMailer(true);
    
    try {
        //Server settings
        $mail->SMTPDebug = 0;                      //Enable verbose debug output
        $mail->isSMTP();                                            //Send using SMTP
        $mail->Host       = 'smtp.gmail.com';                     //Set the SMTP server to send through
        $mail->SMTPAuth   = true;                                   //Enable SMTP authentication
        $mail->Username   = SMTP_EMAIL;                     //SMTP username
        $mail->Password   = SMTP_PASSWORD;                               //SMTP password
        $mail->SMTPSecure = PHPMailer::ENCRYPTION_SMTPS;            //Enable implicit TLS encryption
        $mail->Port       = 465;                                    //TCP port to connect to; use 587 if you have set `SMTPSecure = PHPMailer::ENCRYPTION_STARTTLS`
    
        //Recipients
        $mail->setFrom(HOST_EMAIL, HOST_NAME);
        $mail->addAddress(RECIPIENT_EMAIL, RECIPIENT_NAME);     //Add a recipient
    
        //Content
        $name = isset($_POST['name']) ? preg_replace("/[^\.\-\' a-zA-Z0-9]/", "", $_POST['name']) : "";
        $senderEmail = isset($_POST['email']) ? preg_replace("/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['email']) : "";
        $phone = isset($_POST['phone']) ? preg_replace("/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['phone']) : "";
        $services = isset($_POST['services']) ? preg_replace("/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['services']) : "";
        $subject = isset($_POST['subject']) ? preg_replace("/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['subject']) : "";
        $address = isset($_POST['address']) ? preg_replace("/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['address']) : "";
        $website = isset($_POST['website']) ? preg_replace("/[^\.\-\_\@a-zA-Z0-9]/", "", $_POST['website']) : "";
        $message = isset($_POST['message']) ? preg_replace("/(From:|To:|BCC:|CC:|Subject:|Content-Type:)/", "", $_POST['message']) : "";
    
        $mail->isHTML(true);                                  //Set email format to HTML
        $mail->Subject = 'A contact request send by ' . $name;
        $mail->Body    = 'Name: ' . $name . "<br>";
        $mail->Body .= 'Email: ' . $senderEmail . "<br>";
    
    
        if ($phone) {
            $mail->Body .= 'Phone: ' . $phone . "<br>";
        }
        if ($services) {
            $mail->Body .= 'services: ' . $services . "<br>";
        }
        if ($subject) {
            $mail->Body .= 'Subject: ' . $subject . "<br>";
        }
        if ($address) {
            $mail->Body .= 'Address: ' . $address . "<br>";
        }
        if ($website) {
            $mail->Body .= 'Website: ' . $website . "<br>";
        }
    
        $mail->Body .= 'message: ' . "<br>" . $message;
    
        $mail->send();
        echo "<div class='inner success'><p class='success'>Thanks for contacting us. We will contact you ASAP!</p></div><!-- /.inner -->";
    } catch (Exception $e) {
        echo "<div class='inner error'><p class='error'>Message could not be sent. Mailer Error: {$mail->ErrorInfo}</p></div><!-- /.inner -->";
    }
    

#CSS Structure

The style.css file contains all of the specific stylings for the page.

                	


    
        <link rel="stylesheet" href="assets/vendors/bootstrap/css/bootstrap.min.css" />
        <link rel="stylesheet" href="assets/vendors/animate/animate.min.css" />
        <link rel="stylesheet" href="assets/vendors/animate/custom-animate.css" />
        <link rel="stylesheet" href="assets/vendors/fontawesome/css/all.min.css" />
        <link rel="stylesheet" href="assets/vendors/jarallax/jarallax.css" />
        <link rel="stylesheet" href="assets/vendors/jquery-magnific-popup/jquery.magnific-popup.css" />
        <link rel="stylesheet" href="assets/vendors/odometer/odometer.min.css" />
        <link rel="stylesheet" href="assets/vendors/swiper/swiper.min.css" />
        <link rel="stylesheet" href="assets/vendors/elitecons-icon/style.css">
        <link rel="stylesheet" href="assets/vendors/owl-carousel/owl.carousel.min.css" />
        <link rel="stylesheet" href="assets/vendors/owl-carousel/owl.theme.default.min.css" />
        <link rel="stylesheet" href="assets/vendors/bootstrap-select/css/bootstrap-select.min.css" />
        <link rel="stylesheet" href="assets/vendors/jquery-ui/jquery-ui.css" />
        <link rel="stylesheet" href="assets/vendors/nice-select/nice-select.css" />

        <!-- template styles -->
        <link rel="stylesheet" href="assets/css/elitecons.css" />
        <link rel="stylesheet" href="assets/css/elitecons-responsive.css" />

 
                        
                    
                

#Javascript Structure

        


            <script src="assets/vendors/jquery/jquery-3.6.0.min.js"></script>
            <script src="assets/vendors/bootstrap/js/bootstrap.bundle.min.js"></script>
            <script src="assets/vendors/jarallax/jarallax.min.js"></script>
            <script src="assets/vendors/jquery-ajaxchimp/jquery.ajaxchimp.min.js"></script>
            <script src="assets/vendors/jquery-appear/jquery.appear.min.js"></script>
            <script src="assets/vendors/jquery-circle-progress/jquery.circle-progress.min.js"></script>
            <script src="assets/vendors/jquery-magnific-popup/jquery.magnific-popup.min.js"></script>
            <script src="assets/vendors/jquery-validate/jquery.validate.min.js"></script>
            <script src="assets/vendors/odometer/odometer.min.js"></script>
            <script src="assets/vendors/swiper/swiper.min.js"></script>
            <script src="assets/vendors/wnumb/wNumb.min.js"></script>
            <script src="assets/vendors/wow/wow.js"></script>
            <script src="assets/vendors/isotope/isotope.js"></script>
            <script src="assets/vendors/owl-carousel/owl.carousel.min.js"></script>
            <script src="assets/vendors/bootstrap-select/js/bootstrap-select.min.js"></script>
            <script src="assets/vendors/jquery-ui/jquery-ui.js"></script>
            <script src="assets/vendors/jquery.circle-type/jquery.circleType.js"></script>
            <script src="assets/vendors/jquery.circle-type/jquery.lettering.min.js"></script>
            <script src="assets/vendors/nice-select/jquery.nice-select.min.js"></script>
            <script src="assets/vendors/marquee/marquee.min.js"></script>
            <!-- template js -->
            <script src="assets/js/elitecons.js"></script>
            
        
    

#Mailchimp Settings:

You can edit your form simply and quickly. Open sonchooy.js in assets/js folder and change following area

                
            
            // mailchimp form
            if ($(".mc-form").length) {
                $(".mc-form").each(function () {
                var Self = $(this);
                var mcURL = Self.data("url");
                var mcResp = Self.parent().find(".mc-form__response");

                Self.ajaxChimp({
                    url: mcURL,
                    callback: function (resp) {
                    // appending response
                    mcResp.append(function () {
                        return '<p class="mc-message">' + resp.msg + "</p>";
                    });
                    // making things based on response
                    if (resp.result === "success") {
                        // Do stuff
                        Self.removeClass("errored").addClass("successed");
                        mcResp.removeClass("errored").addClass("successed");
                        Self.find("input").val("");

                        mcResp.find("p").fadeOut(10000);
                    }
                    if (resp.result === "error") {
                        Self.removeClass("successed").addClass("errored");
                        mcResp.removeClass("successed").addClass("errored");
                        Self.find("input").val("");

                        mcResp.find("p").fadeOut(10000);
                    }
                    }
                });
                });
            }
            

#Credits

#Support

Please send us mail starplatetf@gmail.com You will get a reply 24 hours